import React, {Component} from 'react'
import {connect} from 'react-redux'

import { Link } from "react-router-dom";

import Header from "../components/header";
import {loadPlayGameList}  from "../redux/actions/indexAction"

class AllAward extends Component {
  constructor (props){
   super(props)
   this.state= {}
}

componentDidMount(){
    const {dispatch,Index} = this.props
    Index.get("playlist").length==0 && dispatch(loadPlayGameList())
  }

   render() {
    const {Index} = this.props
    const list = Index.get("playlist")

   return  <div className="allaward">
              <Header title="全部彩种" {...this.props}></Header>
              <div className="allcz">
                <ul>
                {list.map((item,index)=>{
                        return <li key={index}>
                                    <Link to={"/betcenter/"+item.gameCode}>
                                        <img src={"/static/images/ICON_"+item.gameCode+".png"} alt=""/>
                                        <h4>{item.gameName}</h4>
                                        {/* <p>{item.periodTotalStr}</p> */}
                                    </Link>
                                </li>
                    })}
                </ul>
            </div>
   </div>
   }
}

function mapStateToProps(state) {
    return {
      Index:state.Index
    }
  }
  
  export default connect(mapStateToProps)(AllAward)